<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title th:text="${post.ptitle}"></title>
    <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/wangeditor@latest/dist/wangEditor.min.js"></script>
    <script type="text/javascript" src="../../js/editor/lookPost.js"></script>
    <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
    <link rel="stylesheet" type="text/css" href="../../css/editor/lookPost.css"/>
    <link rel="icon" type="image/x-icon" href="../../favicon.ico">
    <script>
        var c=()=>{
            let w=document.documentElement.clientWidth;/*获取设备宽度*/
            // let n=(20*(w/1500)>40?40+"px":(20*(w/1500)+"px"));
            let n=20*(w/1500);
            if (n>20){
                n=20+"px"
            }else if (n<20){
                n=20+"px"
            }else{
                n=n+"px"
            }
            document.documentElement.style.fontSize=n;
        }
        window.addEventListener("load",c);
        window.addEventListener("resize",c);
    </script>
</head>
<body>
<div id="wrapper">
<div id="outer">
    <div id="head1">
        <a href="http://localhost:8080/html/editor/writePost.do" class="sbbtn btn a" style="text-align: center">
           <span class="span" style="color: white">发帖</span>
        </a>
        <span class="span" id="space1"></span>
        <a href="javascript:;" class="dcbtn btn a" id="dcbtn" style="text-align: center">
            <span class="span" style="color: white">评论</span>
        </a>
        <span class="span" id="space2"></span>
        <a href="javascript:history.back(-1);" class="rlbtn btn a" style="text-align: center">
            <span class="span">返回</span>
        </a>
    </div>
    <div id="head2">
        <span class="span" id="userid" style="display: none" th:text="${post.userid}"></span>
        <span class="span" style="color: #FF4500">主题:[<span id="typeMes" class="head2_1 span" th:text="${post.ptype}"></span>]&nbsp;&nbsp;&nbsp;</span>
        <span class="span">标题:【<span id="titleMes" class="head2_1 span" th:text="${post.ptitle}"></span>】&nbsp;&nbsp;&nbsp;</span>
        <span class="span">发表于:<span id="timeMes" class="head2_2 span" th:text="${post.ptime}"></span>&nbsp;&nbsp;&nbsp;</span>
        <span class="head2_3 span"></span>
        <a href="javascript:;" id="buttonCopy" class="head2_1 a">[复制帖子链接]</a>
    </div>
<!--    页面主题，显示帖子内容-->
    <div id="body">
        <div id="personMes">
            <img id="perMesPic" th:src="@{'../../../'+${post.hphoto}}"><br>
            <span class="perMes span">姓名: </span>
            <span id="perMesName" class="perMes span" th:text="${post.realname}"></span><br>
            <span class="perMes span">组织: </span>
            <span id="perMesGroup" class="perMes span" th:text="${post.gname}"></span><br>
            <span class="perMes span">专业: </span>
            <span id="perMesMajor" class="perMes span" th:text="${post.mname}"></span><br>
            <span class="perMes span">学院: </span>
            <span id="perMesCollege" class="perMes span" th:text="${post.cname}"></span><br>
            <img class="badge" th:each="badge:${badgelist}" th:src="@{${badge.bpath}}" th:title="${badge.bname}" style="width: 1.7rem;height: 1.7rem">
        </div>
        <div id="post" th:utext="${post.pcontent}">
        </div>
    </div>
<!--    工具栏-->
    <div id="tool">
        <span><img id="updateImg" src="../../images/editor/edit.png" style="margin: 0.4rem"></span>
        <button id="update" class="update">修改</button>
        <span class="tool1 span"></span>
        <img id="giveup" class="tool"  th:src="${giveup}">
        <span id="giveupCon" class="tool2 span" th:text="${giveupCon}"></span>
        <img id="collect" class="tool" th:src="${collect}">
        <span id="collectCon" class="tool2 span" th:text="${collectCon}"></span>
        <span class="tool1 span"></span>
    </div>
<!--    评论书写区-->
    <div id="discussBox">
        <div id="discuss"></div>
        <button id="submitDiscuss" type="submit" value="发表评论">发表评论</button>
    </div>
    <textarea id="text1"></textarea>
<!--    评论显示区-->
    <div id="discussMes">
        <table style="border:1px solid #000000;width: 100%"  th:each="commentList:${commentList}"  id="fathercom">
            <tr>
                <td rowspan="2" id="fist_td" >
                    <img th:src="@{'../../../'+${commentList.hphoto}}" id="father_hphoto">
                </td>

                <td>
                    <span th:text="${commentList.comid}" style="display: none" id="father_comid"></span>

                    <span th:text="${commentList.realname}" id="second_td"></span>
                </td>
            </tr>
            <tr>
                <td id="content_heigth">
                    <div th:utext="${commentList.comcontent}" class="reply_con"></div>
                </td>
            </tr>
            <tr>
                <td></td>
                <td style="display: table-cell;" >
                    <span th:text="${commentList.comid}"  class="reply_comid" style="display: none"></span>
                    <span th:text="${commentList.comtime}" id="time_style" style="vertical-align: middle"></span>&nbsp;&nbsp;
                    <img src="../../../images/editor/reply.png" style="vertical-align: middle">
                    <span style="display: none" th:text="${commentList.realname}"></span><!--获取被评论人的姓名，不能动-->
                    <a id="reply_style" class="reply_btn" href="javascript:;" onmouseover="javascript:this.style.background='hotpink'" onmouseout="javascript:this.style.background='white'">回复</a>
                    <span th:text="${commentList.userid}" style="display: none"> </span><!--获取被评论人的userid，不能动-->&nbsp;&nbsp;&nbsp;
                    <a href="javascript:;" style="vertical-align: middle" class="com_up" >
                        <img th:src="${#lists.contains(comUpRecordList, commentList.comid)?'../../../images/editor/comup2.png':'../../../images/editor/comup1.png'}" id="up_img">
                    </a>
                    <span th:text="${commentList.comup==0?'赞':commentList.comup}" id="reply_style"></span>
                </td>
            </tr>
            <tr>
                <td></td>
                <td>
                    <table id="childcom" th:each="childList:${commentList.getChildCom()}" width="100%">
                        <tr>
                            <td id="child_fist_td">
                                <img th:src="@{'../../../'+${childList.hphoto}}" id="child_hphoto">
                            </td>
                            <td  id="content_heigth">
                                <div style="float: left;">
                                    <span th:text="${childList.realname}" id="user_name_style"></span>&nbsp;
                                    <span>回复</span>&nbsp;
                                    <span th:text="${childList.useredrealname}" id="usered_name_style"></span>&nbsp;
                                    <span>:</span>&nbsp;&nbsp;
                                </div>
                                <div style="margin-top:5px;" th:utext="${childList.comcontent}" class="reply_con"></div >

                            </td>
                        </tr>
                        <tr >
                            <td></td>
                            <td >
                                <span th:text="${childList.comid}" class="reply_comid" style="display: none"></span>
                                <span th:text="${childList.comtime}" id="time_style"></span>&nbsp;&nbsp;
                                <img src="../../../images/editor/reply.png" style="vertical-align: middle">
                                <span style="display: none" th:text="${childList.realname}"></span><!--获取被评论人的姓名，不能动-->
                                <a id="reply_style" class="reply_btn" href="javascript:;" onmouseover="javascript:this.style.background='hotpink'" onmouseout="javascript:this.style.background='white'">回复</a>&nbsp;&nbsp;&nbsp
                                <span th:text="${childList.userid}" style="display: none" ></span><!--获取被评论人的userid，不能动-->
                                <a href="javascript:;" style="vertical-align: middle" class="com_up" >
                                    <img th:src="${#lists.contains(comUpRecordList, childList.comid)?'../../../images/editor/comup2.png':'../../../images/editor/comup1.png'}" id="up_img">
                                </a>
                                <span th:text="${childList.comup}==0?'赞':${childList.comup}" id="reply_style"></span>
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
            <tr>
                <td></td>
                <td class="reply_write">
                    <!--                    <div id="discuss_tab">这里是评论区</div>-->
                </td>
            </tr>
        </table>
    </div>
    <textarea id="text2"></textarea>
    <!-- 底部其他信息显示 -->
    <div id="buttom">
    </div>
</div>
<!--弹窗-->
<div id="showmsg" style="display:none;">
    <p id="msg">这里是弹窗!!!!!!!!!!!!!!!</p>
</div>
</div>
</body>
</html>